<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no" />
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>产品管理</title>
    <link rel="stylesheet" href="../css/common.css">
    <link rel="stylesheet" href="../css/page.css">
    <script src="../js/jquery-3.2.1.min.js"></script>
    <script src="../js/media.js"></script>
    <script src="../js/common.js"></script>



    <style>
        .bd-0 {
            display: none;
        }

        .active {
            display: block;
        }
    </style>
</head>

<body>
    <!--头部-->
    <div class="public-header flex">
        <!--<span class="public-header-left-search"></span>-->
        <span class="public-header-left-back"></span>
        <span class="public-header-center">产品管理</span>
        <span class="public-header-right" onclick='javascript:window.location.href="../page/Publish_goods.html"'>新建产品</span>
    </div>

    <!--正文-->
    <div class="Lot-management bc-gray">
        <div class="hd flex">
            <a href="javascript:;" :class="{active:item.a1 == 2}" v-for='item in list' @click='click_pop(this)'>{{item.a2}}</a>
 
        </div>
        <div class="bd">
            <div class="bd-1 bd-0 active">
                <ul class="clearfix">
                    <li class="clearfix" v-for='item in datas'>
                        <img :src="item.produce_head_image" alt="">
                        <div>
                            {{item.produce_describe}}
                        </div>
                        <em class="time">09-09</em>
                        <img src="../img/二维码@2x 2.png" alt="" class="em">
                    </li>
                </ul>
            </div>
            <div class="bd-2 bd-0">
                <ul class="clearfix">
                    <li class="clearfix" v-for='item in datas'>
                        <img :src="item.produce_head_image" alt="">
                        <div>
                            {{item.produce_describe}}
                        </div>
                        <em class="time">09-09</em>
                        <img src="../img/二维码@2x 2.png" alt="" class="em">
                    </li>
                </ul>
            </div>
            <div class="bd-3 bd-0">
                <ul class="clearfix">
                    <li class="clearfix" v-for='item in datas'>
                        <img :src="item.produce_head_image" alt="">
                        <div>
                            {{item.produce_describe}}
                        </div>
                        <em class="time">09-09</em>
                        <img src="../img/二维码@2x 2.png" alt="" class="em">
                    </li>
                </ul>
            </div>
            <div class="bd-4 bd-0">
                <ul class="clearfix">
                    <li class="clearfix" v-for='item in datas'>
                        <img :src="item.produce_head_image" alt="">
                        <div>
                            {{item.produce_describe}}
                        </div>
                        <em class="time">09-09</em>
                        <img src="../img/二维码@2x 2.png" alt="" class="em">
                    </li>
                </ul>
            </div>
            <div class="bd-5 bd-0 ">
                <ul class="clearfix">
                    <li class="clearfix" v-for='item in datas'>
                        <img :src="item.produce_head_image" alt="">
                        <div>
                            {{item.produce_describe}}
                        </div>
                        <em class="time">09-09</em>
                        <img src="../img/二维码@2x 2.png" alt="" class="em">
                    </li>
                </ul>
            </div>
            <div class="bd-6 bd-0">
                <ul class="clearfix">
                    <li class="clearfix" v-for='item in datas'>
                        <img :src="item.produce_head_image" alt="">
                        <div>
                            {{item.produce_describe}}
                        </div>
                        <em class="time">09-09</em>
                        <img src="../img/二维码@2x 2.png" alt="" class="em">
                    </li>
                </ul>
            </div>


        </div>




    </div>



    <script>
        $(function () {
           



        })
    </script>
    <script src="../js/vue.js"></script>
    <script src="../js/vue-resource.min.js"></script>
    <script>
        $(function () {
            new Vue({
                el: 'body',
                data: {
                    datas: [],
                    list: [{
                            a1: '2',
                            a2: '审核中'
                        },
                        {
                            a1: '3',
                            a2: '竞拍中'
                        },
                        {
                            a1: '4',
                            a2: '已截拍'
                        }, {
                            a1: '5',
                            a2: '已流拍'
                        },
                        {
                            a1: '6',
                            a2: '已失败'
                        },
                        {
                            a1: '7',
                            a2: '草稿箱'
                        }
                    ]
                },
                ready: function () {
                    this.$http.get(base_url+'ZITAOHUI/information', {
                        params: {
                            value: 2
                        }
                    }).then(function (response) {
                        console.log(response)
                        let all_data = response.data.extend.list;
                        this.$set('datas', all_data)
                    })

                    setTimeout(function() {
                         $('.hd a').click(function () {
                var index = $(this).index();
                $(this).addClass('active').siblings().removeClass('active');
                $('.bd-0').eq(index).addClass('active').siblings().removeClass('active');
            })
                    }, 50);
                },
                methods: {
                    click_pop: function (t) {
                        console.log(t)
                        this.$http.get(base_url+'ZITAOHUI/information', {
                            params: {
                                value: t.item.a1
                            }
                        }).then(function (response) {
                            console.log(response)
                            let all_data = response.data.extend.list;
                            this.$set('datas', all_data)
                        })
                    }
                }
            })
        })
    </script>
</body>

</html>